<template>
  <div class="app-container">
    <div class="qrCodeContainer" style="width: 450px; height: 50px; display: none; width: 100%">
      <h1 class="title" style="width: 480px; margin-left: 45%">{{ $t(`Print.RongyangClothingReplenishmentList`) }}</h1>
      <h2 style="margin-left: 70px; font-size: 13px">{{ $t(`Print.DateOfPrinting`) }}:{{ formatCurrentDateTime(currentDate) }}</h2>
      <div style="width: 100%; margin: auto">
        <div style="display: flex; width: 100%; font-size: 11px; justify-content: space-between">
          <h2 style="margin-left: 70px; font-size: 11px">{{ $t(`Print.FeedOrderNumber`) }}:{{ tableDateListS?.slipNo }}</h2>
          <h2 style="margin-left: 70px; font-size: 11px">{{ $t(`Print.InstructionNumber`) }}:{{ slipNoList3?.lotNo }}</h2>
          <h2 style="margin-left: 70px; font-size: 11px">{{ $t(`Print.ShapeDieForm`) }}:{{ slipNoList3?.style }}</h2>
          <h2 style="margin-left: 70px; font-size: 11px">{{ $t(`Print.Make_upDate`) }}:{{ tableDateListS?.slipDate }}</h2>
          <h2 style="margin-left: 70px; font-size: 11px">{{ $t(`Print.Make_upUnits`) }}:{{ tableDateListS?.dutyDeptName }}</h2>
          <h2 style="margin-left: 70px; font-size: 11px">{{ $t(`Print.OpenASinglePerson`) }}:{{ userInfo?.chiName }}</h2>
          <h2 style="margin-left: 70px; font-size: 11px">{{ $t(`Print.FeedType`) }}:{{ value1 }}</h2>
        </div>

        <h2 style="margin-left: 70px; font-size: 11px">{{ $t(`Print.NoteDescription`) }}:{{ remarkList }}</h2>

        <div style="border: 1px solid black; width: 99.9%; margin: 0; padding: 0; display: flex">
          <div style="width: 50%; border-right: 1px solid black; padding: 10px">
            <h1 style="font-size: 10px" v-for="(item, index) in printInOneTableDate.slice(0, Math.ceil(printInOneTableDate.length / 2))" :key="index">
              {{ item }}
            </h1>
          </div>
          <div style="width: 50%; padding: 10px">
            <h1 style="font-size: 10px" v-for="(item, index) in printInOneTableDate.slice(Math.ceil(printInOneTableDate.length / 2))" :key="index">
              {{ item }}
            </h1>
          </div>
        </div>

        <div style="width: 100%">
          <div style="border: 1px solid" v-for="(page, pageIndex) in pages" :key="pageIndex">
            <table style="width: 100%; font-size: 13px">
              <tbody>
                <tr>
                  <td>{{ $t(`Print.GuestNumber`) }}:</td>
                  <td v-for="(iten1, index) in GuestNumber" :key="index">{{ iten1 }}#</td>
                  <td>{{ $t(`Print.TotalDispatch`) }}</td>
                  <td>{{ $t(`Print.NumberOfPieces`) }}</td>
                  <td>{{ $t(`Print.Pre_fill`) }}</td>
                  <!-- 更多的数据单元格 -->
                </tr>
                <tr>
                  <td>{{ $t(`Print.BigBottomNumber`) }}:</td>
                  <td v-for="(iten1, index) in OutbackgroundNumber" :key="index">{{ iten1 }}#</td>
                  <td></td>
                  <td></td>
                  <td></td>
                  <!-- 更多的数据单元格 -->
                </tr>

                <tr>
                  <td>{{ $t(`Print.Place`) }}:</td>
                  <td style="padding: 0" v-for="(iten1, index) in OutbackgroundNumber" :key="index">
                    <div style="display: flex; align-items: center; justify-content: center; height: 100%">
                      <span>{{ $t(`Print.Left`) }}</span>
                      <span style="height: 25px; border-left: 1px solid; margin-left: 5px; margin-right: 5px" class="parent"></span>
                      <span>{{ $t(`Print.Right`) }}</span>
                    </div>
                  </td>

                  <td></td>
                  <td></td>
                  <td></td>
                  <!-- 更多的数据单元格 -->
                </tr>

                <tr v-for="(item, rowIndex) in page" :key="rowIndex">
                  <td style="font-size: 8px">{{ item.partName }}</td>

                  <!-- 用于显示 lqty 和 rqty -->
                  <td style="padding: 0" v-for="qtyIndex in 14" :key="qtyIndex">
                    <div style="display: flex; align-items: center; justify-content: center; height: 100%">
                      <span>{{ item['lqty' + qtyIndex] }}</span>
                      <span style="height: 25px; border-left: 1px solid; margin-left: 5px; margin-right: 5px" class="parent"></span>
                      <span>{{ item['rqty' + qtyIndex] }}</span>
                    </div>
                  </td>

                  <!-- 添加总计和其他列 -->
                  <td>{{ item.total }}</td>
                  <td>{{ tableDateListS?.cutNum }}</td>
                  <td></td>
                  <!-- 更多的数据单元格根据需要 -->
                </tr>

                <!-- 更多的行 -->
              </tbody>
              <!-- 可选的 tfoot 部分 -->
            </table>
          </div>

          <table style="width: 100%; font-size: 13px">
            <thead>
              <tr>
                <th>{{ $t(`Print.MaterialColorKey`) }}</th>
                <th>{{ $t(`Print.MaterialName`) }}</th>
                <th>{{ $t(`Print.MaterialSpecifications`) }}</th>
                <th>{{ $t(`Print.Unit`) }}</th>
                <th>{{ $t(`Print.SubsidyConsumption`) }}</th>
                <th>{{ $t(`Print.TheOriginalWarehouseShouldBeIssued`) }}</th>

                <th>{{ $t(`Print.InventoryInUse`) }}</th>
                <th>{{ $t(`Print.ResponsibleConsumption`) }}</th>
                <th>{{ $t(`Print.OriginalWarehouseDeduction`) }}</th>
                <th>{{ $t(`Print.Remark`) }}</th>
              </tr>
            </thead>
            <tbody>
              <tr v-for="(iten1, index) in SupplementaryDetailDataStorage.mtl" :key="index">
                <td>{{ iten1.mtlColor }}</td>
                <td>{{ iten1.mtlName }}</td>
                <td>{{ iten1.mtlSpec }}</td>
                <td>{{ iten1.mtlUnit }}</td>

                <td>{{ iten1.reqQty }}</td>
                <td>{{ iten1.actQty }}</td>

                <td>{{ iten1.subQty }}</td>
                <td>{{ iten1.actQty1 }}</td>

                <td>{{ iten1.actQty1 }}</td>

                <td>{{ iten1.remark }}</td>
                <!-- 更多的数据单元格 -->
              </tr>
              <!-- 更多的行 -->
            </tbody>
            <!-- 可选的 tfoot 部分 -->
          </table>
        </div>
        <div style="display: flex; justify-content: space-between; width: 85%; font-size: 17px; width: 80%; margin: auto">
          <h2 style="font-size: 13px">{{ $t(`Print.Approval`) }}:</h2>
          <h2 style="font-size: 13px">{{ $t(`Print.Finance`) }}:</h2>
          <h2 style="font-size: 13px">{{ $t(`Print.QualityControl`) }}:</h2>
          <h2 style="font-size: 13px">{{ $t(`Print.OriginalWarehouse`) }}:</h2>
          <h2 style="font-size: 13px">{{ $t(`Print.Manger`) }}:</h2>
          <h2 style="font-size: 13px">{{ $t(`Print.SectionLeader`) }}:</h2>
          <h2 style="font-size: 13px">{{ $t(`Print.Leader`) }}:</h2>
        </div>
      </div>
    </div>

    <div class="qrCodeContainer1" style="width: 450px; height: 50px; display: none; width: 100%">
      <h1 class="title" style="width: 480px; margin-left: 45%">{{ $t(`Print.RongyangClothingReplenishmentList`) }}</h1>
      <h2 style="margin-left: 70px; font-size: 13px">{{ $t(`Print.DateOfPrinting`) }}:{{ formatCurrentDateTime(currentDate) }}</h2>
      <div style="width: 95%; margin: auto">
        <div style="display: flex; width: 100%; font-size: 11px; justify-content: space-between">
          <h2 style="margin-left: 70px; font-size: 11px">{{ $t(`Print.FeedOrderNumber`) }}:{{ tableDateListS?.slipNo }}</h2>
          <h2 style="margin-left: 70px; font-size: 11px">{{ $t(`Print.InstructionNumber`) }}:{{ slipNoList3?.lotNo }}</h2>
          <h2 style="margin-left: 70px; font-size: 11px">{{ $t(`Print.ShapeDieForm`) }}:{{ slipNoList3?.style }}</h2>
          <h2 style="margin-left: 70px; font-size: 11px">{{ $t(`Print.Make_upDate`) }}:{{ tableDateListS?.slipDate }}</h2>
          <h2 style="margin-left: 70px; font-size: 11px">{{ $t(`Print.Make_upUnits`) }}:{{ tableDateListS?.dutyDeptName }}</h2>
          <h2 style="margin-left: 70px; font-size: 11px">{{ $t(`Print.OpenASinglePerson`) }}:{{ userInfo?.chiName }}</h2>
          <h2 style="margin-left: 70px; font-size: 11px">{{ $t(`Print.FeedType`) }}:{{ value1 }}</h2>
        </div>

        <h2 style="margin-left: 70px; font-size: 11px">{{ $t(`Print.NoteDescription`) }}:{{ remarkList }}</h2>

        <div style="border: 1px solid black; width: 99.9%; margin: 0; padding: 0; display: flex">
          <div style="width: 50%; border-right: 1px solid black; padding: 10px">
            <h1 style="font-size: 10px" v-for="(item, index) in printInOneTableDate.slice(0, Math.ceil(printInOneTableDate.length / 2))" :key="index">
              {{ item }}
            </h1>
          </div>
          <div style="width: 50%; padding: 10px">
            <h1 style="font-size: 10px" v-for="(item, index) in printInOneTableDate.slice(Math.ceil(printInOneTableDate.length / 2))" :key="index">
              {{ item }}
            </h1>
          </div>
        </div>

        <div style="width: 100%">
          <div style="border: 1px solid" v-for="(page, pageIndex) in pages" :key="pageIndex">
            <table style="width: 100%; font-size: 13px">
              <tbody>
                <tr>
                  <td>{{ $t(`Print.GuestNumber`) }}:</td>
                  <td v-for="(iten1, index) in GuestNumber.slice(0, 14)" :key="index">{{ iten1 }}#</td>
                  <td>{{ $t(`Print.TotalDispatch`) }}</td>
                  <td>{{ $t(`Print.NumberOfPieces`) }}</td>
                  <td>{{ $t(`Print.Pre_fill`) }}</td>
                  <!-- 更多的数据单元格 -->
                </tr>
                <tr>
                  <td>{{ $t(`Print.BigBottomNumber`) }}:</td>
                  <td v-for="(iten1, index) in OutbackgroundNumber.slice(0, 14)" :key="index">{{ iten1 }}#</td>
                  <td></td>
                  <td></td>
                  <td></td>
                  <!-- 更多的数据单元格 -->
                </tr>

                <tr>
                  <td>{{ $t(`Print.Place`) }}</td>
                  <td style="padding: 0" v-for="(iten1, index) in OutbackgroundNumber.slice(0, 14)" :key="index">
                    <div style="display: flex; align-items: center; justify-content: center; height: 100%">
                      <span>{{ $t(`Print.Left`) }}</span>
                      <span style="height: 25px; border-left: 1px solid; margin-left: 5px; margin-right: 5px" class="parent"></span>
                      <span>{{ $t(`Print.Right`) }}</span>
                    </div>
                  </td>

                  <td></td>
                  <td></td>
                  <td></td>
                  <!-- 更多的数据单元格 -->
                </tr>

                <tr v-for="(item, rowIndex) in page" :key="rowIndex">
                  <td style="font-size: 8px">{{ item.partName }}</td>

                  <!-- 用于显示 lqty 和 rqty -->
                  <td style="padding: 0" v-for="qtyIndex in 14" :key="qtyIndex">
                    <div style="display: flex; align-items: center; justify-content: center; height: 100%">
                      <span>{{ item['lqty' + qtyIndex] }}</span>
                      <span style="height: 25px; border-left: 1px solid; margin-left: 5px; margin-right: 5px; padding: 0" class="parent"></span>
                      <span>{{ item['rqty' + qtyIndex] }}</span>
                    </div>
                  </td>

                  <!-- 添加总计和其他列 -->
                  <td>{{ item.total }}</td>
                  <td>{{ tableDateListS?.cutNum }}</td>
                  <td></td>
                  <!-- 更多的数据单元格根据需要 -->
                </tr>

                <!-- 更多的行 -->
              </tbody>
              <!-- 可选的 tfoot 部分 -->
            </table>
          </div>

          <table style="width: 100%; font-size: 13px">
            <thead>
              <tr>
                <th>{{ $t(`Print.MaterialColorKey`) }}</th>
                <th>{{ $t(`Print.MaterialName`) }}</th>
                <th>{{ $t(`Print.MaterialSpecifications`) }}</th>
                <th>{{ $t(`Print.Unit`) }}</th>
                <th>{{ $t(`Print.SubsidyConsumption`) }}</th>
                <th>{{ $t(`Print.TheOriginalWarehouseShouldBeIssued`) }}</th>

                <th>{{ $t(`Print.InventoryInUse`) }}</th>
                <th>{{ $t(`Print.ResponsibleConsumption`) }}</th>
                <th>{{ $t(`Print.OriginalWarehouseDeduction`) }}</th>
                <th>{{ $t(`Print.Remark`) }}</th>
              </tr>
            </thead>
            <tbody>
              <tr v-for="(iten1, index) in SupplementaryDetailDataStorage.mtl" :key="index">
                <td>{{ iten1.mtlColor }}</td>
                <td>{{ iten1.mtlName }}</td>
                <td>{{ iten1.mtlSpec }}</td>
                <td>{{ iten1.mtlUnit }}</td>

                <td>{{ iten1.reqQty }}</td>
                <td>{{ iten1.actQty }}</td>

                <td>{{ iten1.subQty }}</td>
                <td>{{ iten1.actQty1 }}</td>

                <td>{{ iten1.actQty1 }}</td>

                <td>{{ iten1.remark }}</td>
                <!-- 更多的数据单元格 -->
              </tr>
              <!-- 更多的行 -->
            </tbody>
            <!-- 可选的 tfoot 部分 -->
          </table>
        </div>

        <div style="display: flex; justify-content: space-between; width: 85%; font-size: 17px; width: 80%; margin: auto">
          <h2 style="font-size: 13px">{{ $t(`Print.Approval`) }}:</h2>
          <h2 style="font-size: 13px">{{ $t(`Print.Finance`) }}:</h2>
          <h2 style="font-size: 13px">{{ $t(`Print.QualityControl`) }}:</h2>
          <h2 style="font-size: 13px">{{ $t(`Print.OriginalWarehouse`) }}:</h2>
          <h2 style="font-size: 13px">{{ $t(`Print.Manger`) }}:</h2>
          <h2 style="font-size: 13px">{{ $t(`Print.SectionLeader`) }}:</h2>
          <h2 style="font-size: 13px">{{ $t(`Print.Leader`) }}:</h2>
        </div>
      </div>
    </div>

    <div class="OrderSummaryContainer">
      <Find :OriginalFilter="{ static: true }" :formList="formList" @Launchform="Launchform" @findClicked="findClicked" />
      <el-card style="margin-top: 10px" shadow="always" :body-style="{ padding: '5px' }">
        <div style="display: flex">
          <div style="width: 26%">
            <h1>{{ $t(`Print.FeedListInformation`) }}</h1>
            <Table
              :isLoading="isLoading1"
              @currentRow="clicktogetdata"
              :tableData="FeedListDataTableDateList.dtos"
              :tableHeader="tableHeader"
              :TableHeight="100"
              :outTableHeight="215"
            />
            <PageModule
              :PageData="{ total: totalTk, buttonS: true, pageSizeShow: true }"
              :layout="'prev, pager'"
              @pageSizeChange="handleSizeChangeTk"
              @pageChange="handleCurrentChangeTk"
            />
            <el-select style="margin-top: 10px" v-model="value1" class="m-2" :placeholder="$t(`Print.FeedType`)" size="small">
              <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
            </el-select>

            <el-input v-model:model-value="DescrExplain" class="mt10" :autosize="{ minRows: 2 }" type="textarea" :placeholder="$t(`Print.NoteDescription`)" />
            <el-input class="mt10" :autosize="{ minRows: 2 }" type="textarea" :placeholder="$t(`Print.ChargebackInstructions`)" />
          </div>

          <div style="display: flex; flex-direction: column; height: 80px; width: 100%; margin-left: 10px">
            <div style="display: flex">
              <div style="margin-left: 10px; width: 35%; margin-top: 95px">
                <h1>{{ $t(`Print.SupplementDetails`) }}</h1>
                <Table
                  :isLoading="isLoading2"
                  :tableData="SupplementaryDetailDataStorage.detail"
                  :tableHeader="tableHeader2"
                  :TableHeight="50"
                  :outTableHeight="160"
                  @currentRow="clicktogetdata5"
                />
                <h1 style="margin-top: 20px">{{ $t(`Print.SupplementDetails`) }}</h1>
                <Table
                  :isLoading="isLoading2"
                  @currentRow="clicktogetdata6"
                  :tableData="SupplementaryDetailDataStorage.mtl"
                  :tableHeader="tableHeader3"
                  :TableHeight="50"
                  :outTableHeight="180"
                />
                <p style="margin-top: 3px; font-size: 11px; color: blue">{{ $t(`Print.Note_EnterTheFirstLineOfComplementsClickTheSupplementCopyButtonAndTheComplementsOfTheOtherRowsWillBeTheSameAsTheFirstRow`) }}</p>
              </div>

              <div style="margin-left: 10px; width: 36%; margin-top: 21px">
                <div class="scrollbar-container" style="overflow-x: auto; white-space: nowrap">
                  <div style="flex: 0 0 auto; white-space: nowrap">
                    <div style="align-items: center; white-space: nowrap">
                      <span class="mr10">{{ $t(`Print.GuestNumber`) }}:</span>
                      <h1 class="title1" v-for="(item, index) in GuestNumber" :key="index">
                        {{ item }}
                      </h1>
                    </div>
                  </div>
                  <div style="flex: 0 0 auto; white-space: nowrap">
                    <div style="align-items: center; white-space: nowrap">
                      <span class="mr10">{{ $t(`Print.BigBottomNumber`) }}:</span>
                      <h1 style="margin-top: 10px" class="title1" v-for="(item, index) in OutbackgroundNumber" :key="index">
                        {{ item }}
                      </h1>
                    </div>
                  </div>
                  <!-- 表格组件 -->
                  <div style="flex: 1; display: inline-block; margin-left: 65px">
                    <Table
                      :isLoading="isLoading2"
                      :tableData="SupplementaryDetailDataStorage.detail"
                      :tableHeader="tableHeader4"
                      :TableHeight="45"
                      :outTableHeight="138"
                      @inputChange="confirmChange5"
                    />
                  </div>
                </div>

                <div style="display: flex; margin-top: 20px">
                  <div>
                    <h1>{{ $t(`Print.InstructionDetails`) }}</h1>
                    <Table
                      :isLoading="isLoading5"
                      :tableData="TableDateListQuery.lot"
                      :tableHeader="tableHeader6"
                      :TableHeight="50"
                      :outTableHeight="110"
                    />
                  </div>
                  <div style="margin-left: 16px">
                    <h1>{{ $t(`Print.ResponsibilityDetails`) }}</h1>
                    <Table
                      :isLoading="isLoading5"
                      @currentRow="clicktogetdata10"
                      :tableData="TableDateListQuery.duty"
                      :tableHeader="tableHeader5"
                      :TableHeight="50"
                      :outTableHeight="110"
                    />
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </el-card>

      <el-drawer v-if="drawer1" v-model="drawer1" :direction="'ttb'" size="small" :with-header="false">
        <span @click="drawer1 = false" style="float: right; cursor: pointer; color: rgb(7, 7, 7)">X</span>
        <p style="font-size: 18px; margin-top: 12px">{{ $t(`Print.ReplenishmentOperations`) }}</p>
        <Find
          :OriginalFilter="{ static: true }"
          v-if="InsertionComplementSystem"
          :searchImg="false"
          style="margin-top: 12px"
          :formList="formList1"
          @findClicked="findClicked1"
          @Launchform="Launchform1"
          @clickNumber1="clickNumber1"
        />
        <Find
          :OriginalFilter="{ static: true }"
          v-else
          :searchImg="false"
          style="margin-top: 12px"
          :formList="formList1"
          @findClicked="findClicked1"
          @Launchform="Launchform1"
          @clickNumber1="clickNumber1"
        />
        <div style="display: flex; margin-top: 30px">
          <div style="width: 40%">
            <h1>{{ $t(`Print.SelectPart`) }}</h1>
            <Table
              :isLoading="isLoading7"
              :tableData="inquireTableDateListTopGoBootom.dtos"
              :tableHeader="tableHeader1"
              :TableHeight="50"
              :outTableHeight="180"
              :selection="true"
              @currentRow="clicktogetdata1"
              @selectList="selectList2"
              @tableRef="tableRef"
            />
          </div>
          <div style="margin-left: 20px">
            <h1>{{ $t(`Print.SelectNumber`) }}</h1>
            <Table
              :isLoading="isLoading7"
              :tableData="inquireTableDateListTopGoBootom.size"
              :tableHeader="tableHeader7"
              :TableHeight="50"
              :outTableHeight="180"
              :selection="true"
              @selectList="selectList3"
              @tableRef="tableRef"
            />
          </div>
        </div>
        <h1 style="margin-top: 15px">{{ $t(`Print.SelectionOfRawMaterialsForSupplementaryMaterials`) }}</h1>
        <Table
          :isLoading="isLoading2"
          style="width: 40%"
          :tableData="SupplementaryDetailDataStorage.detail"
          :tableHeader="tableHeader8"
          :TableHeight="50"
          :outTableHeight="180"
        />
      </el-drawer>

      <el-drawer v-model="drawer2" :direction="'ttb'" size="small" :with-header="false">
        <span @click="drawer2 = false" style="float: right; cursor: pointer; color: rgb(7, 7, 7)">X</span>
        <h1>{{ $t(`Print.QueryCondition`) }}</h1>
        <Find
          :OriginalFilter="{ static: true }"
          :searchImg="false"
          style="margin-top: 12px"
          :formList="formList5"
          @Launchform="Launchform6"
          @findClicked="findClicked3"
        />
        <div style="display: flex; margin-top: 15px">
          <div style="width: 20%">
            <h1>{{ $t(`Print.VendorInformationDetails`) }}</h1>
            <Table
              :isLoading="isLoading10"
              @selectList="selectList5"
              :selection="true"
              :tableData="vendor.dtos"
              :tableHeader="tableHeader9"
              :TableHeight="100"
              :outTableHeight="170"
            />
            <PageModule
              :PageData="{ total: totalT, pageSizeShow: true, buttonS: true }"
              :layout="'prev, pager'"
              @pageSizeChange="handleSizeChangeT"
              @pageChange="handleCurrentChangeT"
            />
          </div>
          <div style="width: 33%; margin-left: 30px">
            <h1>{{ $t(`Print.EmployeeInformationDetails`) }}</h1>
            <Table
              :isLoading="isLoading11"
              @selectList="selectList1"
              :selection="true"
              :tableData="InformationOfEmployeesIuqeryParmsTableDateList.dtos"
              :tableHeader="tableHeader10"
              :TableHeight="100"
              :outTableHeight="170"
            />
            <PageModule
              :PageData="{ total, pageSizeShow: true, buttonS: true }"
              :layout="'prev, pager'"
              @pageSizeChange="handleSizeChange"
              @pageChange="handleCurrentChange"
            />
          </div>
          <div style="margin-left: 15px; display: flex; align-items: center">
            <el-button style="background-color: #f89027; width: 60px" type="warning" size="small" @click="Interposition">插入 >></el-button>
          </div>
          <div style="width: 22%; margin-left: 30px">
            <h1>{{ $t(`Print.ResponsibleEmployee`) }}</h1>
            <Table
              :isLoading="isLoading12"
              @selectList="selectList6"
              :tableData="ResponsibilityDocumentationListTableDateList"
              :tableHeader="tableHeader11"
              :TableHeight="100"
              :outTableHeight="170"
              @inputChange="confirmChange"
              :getTableList="ResponsibilityDocumentationList"
            />
          </div>
        </div>
      </el-drawer>

      <el-drawer v-model="drawer3" :direction="'ttb'" size="small" :with-header="false">
        <span @click="drawer3 = false" style="float: right; cursor: pointer; color: rgb(7, 7, 7)">X</span>
        <h1>{{ $t(`Print.QueryCondition`) }}</h1>
        <Find
          :OriginalFilter="{ static: true }"
          :searchImg="false"
          style="margin-top: 12px"
          :formList="formList6"
          @Launchform="Launchform7"
          @findClicked="findClicked3"
        />
        <div style="display: flex; margin-top: 15px">
          <div style="width: 20%">
            <h1>{{ $t(`Print.EmployeeInformationDetails`) }}</h1>
            <Table
              :isLoading="isLoading11"
              @selectList="selectList1"
              :selection="true"
              :tableData="InformationOfEmployeesIuqeryParmsTableDateList.dtos"
              :tableHeader="tableHeader10"
              :TableHeight="100"
              :outTableHeight="170"
            />
            <PageModule
              :PageData="{ total, pageSizeShow: true, buttonS: true }"
              :layout="'prev, pager'"
              @pageSizeChange="handleSizeChange"
              @pageChange="handleCurrentChange"
            />
          </div>
          <div style="margin-left: 15px; display: flex; align-items: center">
            <el-button style="background-color: #f89027; width: 60px" type="warning" size="small" @click="Interposition">插入 >></el-button>
          </div>
          <div style="width: 23%; margin-left: 30px">
            <h1>{{ $t(`Print.ResponsibleEmployee`) }}</h1>
            <Table
              :isLoading="isLoading12"
              @selectList="selectList6"
              :tableData="ResponsibilityDocumentationListTableDateList"
              :tableHeader="tableHeader11"
              :TableHeight="100"
              :outTableHeight="170"
              @inputChange="confirmChange"
              :getTableList="ResponsibilityDocumentationList"
            />
          </div>
        </div>
      </el-drawer>
    </div>
  </div>
</template>
<script lang="ts">
import { defineComponent } from 'vue'
import LoginWork from '@/utils/LoginWork'
import JMessage from '@/utils/JMessage'
export default defineComponent({
  name: 'ReplenishmentInvoicing'
})
</script>
<script lang="ts" setup>
import { i18n, Jzhcn } from '@/i18n'
import { computed, onMounted, ref } from 'vue'
import {
  EmployeeDeletion,
  TheAttributionDetailsAreDeleted,
  SupplementaryMaterialDetailsDeleted,
  ResponsibilityProfileAdded,
  FeedTypeModified,
  InstructionDetail,
  GuestNumberDrinkBigBottomNumberInquiry,
  DepartmentAllInquiry,
  VendorDataList,
  TransferReview,
  CompleteOrder,
  ReplenishmentBill,
  Descr,
  MakeUpDetailedProgress,
  FeedPartQuery,
  OpenTheFillerMaterial,
  AddedAnAdditionalComplement,
  PartOfTheMaterialAdded,
  CalculateFeedDetails,
  ComplementaryReplication,
  InformationOfEmployees,
  ResponsibilityDocumentation,
  ResponsibilityProfileNewInsert,
  shareAlike,
  printInBills,
  VendorData,
  FeedPartQuery1,
  ResponsibilityClear,
  TransferReview1
} from '@/api/WarehouseDepartment/FactoryStorage/ReplenishmentInvoicing'
import type {
  EmployeeDeletionParms,
  TheAttributionDetailsAreDeletedParms,
  VendorDatadParmsInterface,
  ReplenishmentBillParms,
  ReplenishmentBillInterfacE,
  MakeUpDetailedProgressInterface,
  FeedPartQueryInterface,
  OpenTheFillerMaterialParms,
  AddedAnAdditionalComplementParms,
  ComplementaryReplicationParms,
  InformationOfEmployeesParms,
  InformationOfEmployeesInterface,
  ResponsibilityDocumentationInterface,
  VendorDatadParms
} from '@/api/WarehouseDepartment/FactoryStorage/ReplenishmentInvoicing'
import { ElMessage } from 'element-plus'
import { ElMessageBox } from 'element-plus'
const isLoading1 = ref(false)
const isLoading2 = ref(false)
const isLoading3 = ref(false)
const isLoading4 = ref(false)
const isLoading5 = ref(false)
const isLoading6 = ref(false)
const isLoading7 = ref(false)
const isLoading8 = ref(false)
const isLoading9 = ref(false)
const isLoading10 = ref(false)
const isLoading11 = ref(false)
const isLoading12 = ref(false)
const isLoading13 = ref(false)
const isLoading14 = ref(false)

// 每页显示的行数
const rowsPerPage = 15

// 计算总页数
const totalPages = computed(() => Math.ceil(SupplementaryDetailDataStorage.value.detail.length / rowsPerPage))

const isLastPage = (pageIndex: number, totalPages: number) => {
  return pageIndex === totalPages - 1
}
// 分割数据为多页
const pages = computed(() => {
  const result = []
  for (let i = 0; i < SupplementaryDetailDataStorage.value.detail.length; i += rowsPerPage) {
    result.push(SupplementaryDetailDataStorage.value.detail.slice(i, i + rowsPerPage))
  }
  console.log(result)
  return result
})

const avtiveButton = ref(true)

const rowAny = ref()

const tableRef = async (row?: any) => {
  if (rowAny.value === undefined) {
    rowAny.value = row
  }

  inquireTableDateList()
  setTimeout(async () => {
    let dtos: any = []
    let dtos1: any = []
    const reuslt = await PartOfTheMaterialAdded(lotNo.value, slipNo1.value)
    if (reuslt !== null) {
      dtos =
        reuslt.size.map((item: any) => {
          return { size: item }
        }) || []
      dtos1 =
        reuslt.seqNo.map((item: any) => {
          return { seqNo: item }
        }) || []
    }
    const sizeList = inquireTableDateListTopGoBootom.value.size
    const sizeList2 = inquireTableDateListTopGoBootom.value.dtos

    if (sizeList && Array.isArray(sizeList)) {
      for (let index = 0; index < sizeList.length; index++) {
        if (dtos[index] && dtos[index].size === sizeList[index].size) {
          if (row) {
            row.toggleRowSelection(sizeList[index], true)
          }
        }
      }
    }

    if (sizeList2 && Array.isArray(sizeList2)) {
      for (let index = 0; index < sizeList2.length; index++) {
        if (dtos1[index] && Number(dtos1[index].seqNo) === sizeList2[index].seqNo) {
          if (row) {
            row.toggleRowSelection(sizeList2[index], true)
          }
        }
      }
    }
  }, 5)
}

// 表头数据
const tableDateListS = ref<any>({})

//客人号 大底号
const GuestNumber = ref<any>([])

const OutbackgroundNumber = ref<any>([])

// 日期
const formatCurrentDateTime = (date?: Date) => {
  const year = date!.getFullYear()
  const month = String(date!.getMonth() + 1).padStart(2, '0') // 使用padStart确保月份是两位数
  const day = String(date!.getDate()).padStart(2, '0') // 使用padStart确保日期是两位数
  const hours = String(date!.getHours()).padStart(2, '0') // 小时
  const minutes = String(date!.getMinutes()).padStart(2, '0') // 分钟
  const seconds = String(date!.getSeconds()).padStart(2, '0') // 秒

  // 返回格式化的日期时间字符串
  return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`
}

const slipNoList3 = ref<any>({})

const currentDate = ref(new Date())

const formList = ref([
  {
    type: 'input',
    inputPlaceholder: '请输入补料单号',
    inputValue: '',
    inputLabel: ''
  },
  {
    type: 'input',
    inputPlaceholder: '请输入指令',
    inputValue: '',
    inputLabel: ''
  },
  {
    type: 'date',
    dateLabel: '补料日期',
    dateValue: ''
  },
  {
    type: 'input',
    inputPlaceholder: '请输入指令',
    inputValue: '',
    inputLabel: ''
  },
  {
    type: 'button',
    checkboxLabel: '插入补料部位(新增)'
  },
  {
    type: 'button',
    checkboxLabel: '插入补料部位(追加)'
  },
  {
    type: 'button',
    checkboxLabel: '计算补料明细'
  },
  {
    type: 'button',
    checkboxLabel: '补量复制'
  },
  {
    type: 'button',
    checkboxLabel: '打印补料单(14个号码)'
  },
  {
    type: 'button',
    checkboxLabel: '转审核'
  },
  {
    type: 'button',
    checkboxLabel: '整单删除'
  },
  {
    type: 'button',
    checkboxLabel: '打印补料单'
  },
  {
    type: 'button',
    checkboxLabel: '责任厂商/员工(%)'
  },
  {
    type: 'button',
    checkboxLabel: '责任员工'
  },
  {
    type: 'select',
    selectValue: '',
    selectP: '责任厂商',
    selectLabel: '',
    selectOptions: []
  },
  {
    type: 'input',
    inputPlaceholder: '数量',
    inputValue: '',
    inputLabel: '',
    inputWidth: '80px'
  },
  {
    type: 'button',
    checkboxLabel: '确认'
  },
  {
    type: 'button',
    checkboxLabel: '补制明细删除'
  },
  {
    type: 'button',
    checkboxLabel: '责任归属明细删除'
  },
  {
    type: 'button',
    checkboxLabel: '保存备注'
  },
  {
    type: 'button',
    checkboxLabel: '保存补料类型'
  },
  {
    type: 'button',
    checkboxLabel: '置空',
    bgColor: '#1890FF'
  },
  {
    type: 'button',
    checkboxLabel: '保存号码',
    bgColor: '#1890FF'
  },
  {
    type: 'button',
    checkboxLabel: '取消转审核'
  }
])

// 转审核
const TransferReviewMethods1 = async () => {
  if (prnFlag1.value === true) {
    const result = await TransferReview1(slipNo1.value)
    if (result.code === 200) {
      FeedListData()
      JMessage.success(result.message)
    } else {
      FeedListData()
      JMessage.error(result.message)
    }
  } else {
    JMessage.warning('未打印不可转审核')
  }
}

const formList1 = ref([
  {
    type: 'select',
    selectValue: '',
    selectP: '补料部门',
    selectLabel: '',
    selectOptions: []
  },
  {
    type: 'radio1',
    checkboxLabel: '普通开补',
    checked: true,
    label: '0'
  },
  {
    type: 'radio1',
    checkboxLabel: '鞋面全套',
    checked: true,
    label: '1'
  },
  {
    type: 'radio1',
    checkboxLabel: '成型全套',
    checked: true,
    label: '2'
  },
  {
    type: 'radio1',
    checkboxLabel: '原材料开补',
    checked: true,
    label: '3'
  },
  {
    type: 'button',
    checkboxLabel: '插入补制资料'
  }
])

const formList2 = ref()

const formList3 = ref()

const formList5 = ref([
  {
    type: 'select',
    selectValue: '',
    selectP: '厂商',
    selectLabel: '',
    selectOptions: []
  },
  {
    type: 'select',
    selectValue: '',
    selectP: '部门',
    selectLabel: '',
    selectOptions: []
  },
  {
    type: 'input',
    inputPlaceholder: '姓名',
    inputValue: '',
    inputLabel: ''
  },
  {
    type: 'button',
    checkboxLabel: '确认'
  },
  {
    type: 'button',
    checkboxLabel: '统一分配'
  },
  {
    type: 'button',
    checkboxLabel: '清空',
    bgColor: '#1890FF'
  },
  {
    type: 'button',
    checkboxLabel: '删除责任员工'
  },
  {
    type: 'button',
    checkboxLabel: '平均分摊'
  },
  {
    type: 'button',
    checkboxLabel: '置空',
    bgColor: '#1890FF'
  }
])

const formList6 = ref([
  {
    type: 'select',
    selectValue: '',
    selectP: '部门',
    selectLabel: '',
    selectOptions: []
  },
  {
    type: 'input',
    inputPlaceholder: '姓名',
    inputValue: '',
    inputLabel: ''
  },
  {
    type: 'input',
    inputPlaceholder: '数量',
    inputValue: '',
    inputLabel: '',
    inputDisabled: true
  },
  {
    type: 'button',
    checkboxLabel: '确认',
    disabled: avtiveButton
  },
  {
    type: 'button',
    checkboxLabel: '统一分配',
    bgColor: '#1890FF'
  },
  {
    type: 'button',
    checkboxLabel: '平均分摊',
    bgColor: '#1890FF'
  },
  {
    type: 'button',
    checkboxLabel: '清空'
  },
  {
    type: 'button',
    checkboxLabel: '删除责任员工'
  }
])

const drawer1 = ref(false)

const drawer2 = ref(false)

const drawer3 = ref(false)

interface summaryDataType {
  index: number
  num: number | undefined
}

// 计算
const summaryData = ref<summaryDataType[]>([
  {
    index: 2,
    num: 0
  }
])

// 员工删除
const EmployeeDeletionMethodsParms = ref<any>({
  deptName: '',
  deptNo: '',
  dutyQty: 0,
  idNo: '',
  name: ''
})

const EmployeeDeletionMethods = async () => {
  const result = await EmployeeDeletion(numberResponsibility.value!, EmployeeDeletionMethodsParms.value)
  if (result.code === 200) {
    ResponsibilityDocumentationList()
    JMessage.success(result.message)
  } else {
    JMessage.error(result.message)
  }
}

const handleCloseMateriaLKlc3 = (_done?: () => void) => {
  ElMessageBox.confirm('确定要删除该数据吗')
    .then(async () => {
      EmployeeDeletionMethods()
    })
    .catch(() => {})
}

// 责任归属明细删除
const TheAttributionDetailsAreDeletedMethodsParms = ref<TheAttributionDetailsAreDeletedParms>({
  deptNo: '',
  dutyName: '',
  dutyQty: 0,
  idNo: '',
  mtlNo: '',
  slipNo: ''
})

const handleCloseMateriaLKlc2 = (_done?: () => void) => {
  ElMessageBox.confirm('确定要删除该数据吗')
    .then(async () => {
      TheAttributionDetailsAreDeletedMethod()
    })
    .catch(() => {})
}

const TheAttributionDetailsAreDeletedMethod = async () => {
  const result = await TheAttributionDetailsAreDeleted(TheAttributionDetailsAreDeletedMethodsParms.value!)
  if (result.code === 200) {
    InstructionDetailMethods()
    JMessage.success(result.message)
  } else {
    JMessage.error(result.message)
  }
}

const clicktogetdata10 = (row: any) => {
  const { dutyName, dutyName2, dutyQty, deptNo, idNo } = row

  // 处理 dutyName 和 dutyName2
  if (dutyName !== null) {
    TheAttributionDetailsAreDeletedMethodsParms.value.dutyName = dutyName
    TheAttributionDetailsAreDeletedMethodsParms.value.dutyQty = dutyQty
    TheAttributionDetailsAreDeletedMethodsParms.value.deptNo = deptNo
    TheAttributionDetailsAreDeletedMethodsParms.value.idNo = idNo
  }

  if (dutyName2 !== null) {
    TheAttributionDetailsAreDeletedMethodsParms.value.dutyName = dutyName2 // 此处可能需要进一步判断逻辑
    TheAttributionDetailsAreDeletedMethodsParms.value.dutyQty = dutyQty
    TheAttributionDetailsAreDeletedMethodsParms.value.deptNo = deptNo
    TheAttributionDetailsAreDeletedMethodsParms.value.idNo = idNo
  }
}

// 补制补料明细删除
const handleCloseMateriaLKlc1 = (_done?: () => void) => {
  ElMessageBox.confirm('确定要删除该数据吗')
    .then(async () => {
      SupplementaryMaterialDetailsDeletedMethods()
    })
    .catch(() => {})
}

const SupplementaryMaterialDetailsDeletedMethods = async () => {
  const result = await SupplementaryMaterialDetailsDeleted(slipNo1.value, lotNo1.value, seqNo1.value)
  if (result.code === 200) {
    MakeUpDetailedProgressList()
    JMessage.success(result.message)
  } else {
    JMessage.error(result.message)
  }
}

// 责任归属明细新增
const qtyList = ref()

const ResponsibilityProfileAddedMethodsParms = ref<any>({
  companyId: '',
  dutyDetail: [],
  mtlNo: '',
  slipNo: '',
  vendorName: '',
  vendorNo: '',
  type: '',
  flag: 0
})

const selectList6 = (row: any) => {
  let list = 0
  row.forEach((element: any) => {
    list += Number(element.qty)
  })
  if (list > Number(formList6.value[2].inputValue)) {
    JMessage.warning('修改的数量总和不能大于上方数量')
    avtiveButton.value = true
  }
  avtiveButton.value = false
  row.map((item: any) => {
    // qtyList.value = item.qty
    ResponsibilityProfileAddedMethodsParms.value.companyId = item.companyId
    item.dutyQty = qtyList.value * (Number(item.qty) / 100)

    EmployeeDeletionMethodsParms.value.deptName = item.deptName
    EmployeeDeletionMethodsParms.value.deptNo = item.deptNo
    EmployeeDeletionMethodsParms.value.dutyQty = item.dutyQty
    EmployeeDeletionMethodsParms.value.idNo = item.idNo
    EmployeeDeletionMethodsParms.value.name = item.name
    ResponsibilityProfileAddedMethodsParms.value.dutyDetail.push(item)
  })
}

const qtyList2 = ref()

const ResponsibilityProfileAddedMethods = async () => {
  if (qtyList.value === undefined) {
    qtyList.value = 0
  }
  ResponsibilityProfileAddedMethodsParms.value.dutyDetail = Array.from(
    new Map(
      ResponsibilityProfileAddedMethodsParms.value.dutyDetail.map((item: any) => [item.idNo, item]) // 使用 id 或其他唯一标识符
    ).values()
  )
  //   ResponsibilityProfileAddedMethodsParms.value.dutyDetail = Array.from(
  //   new Map(
  //     ResponsibilityProfileAddedMethodsParms.value.dutyDetail.map((item:any) => [item.deptNo, item]) // 使用 id 或其他唯一标识符
  //   ).values()
  // );
  const result = await ResponsibilityProfileAdded(qtyList.value, ResponsibilityProfileAddedMethodsParms.value)
  if (result.code === 200) {
    InstructionDetailMethods()
    ResponsibilityProfileAddedMethodsParms.value.flag = 0
    JMessage.success(result.message)
  } else {
    ResponsibilityProfileAddedMethodsParms.value.flag = 0
    InstructionDetailMethods()
    JMessage.error(result.message)
  }
}

// 补料类型修改
const FeedTypeModifiedMethod = async () => {
  const result = await FeedTypeModified(slipNo1.value, value1.value)
  if (result.code === 200) {
    FeedListData()
    JMessage.success(result.message)
  } else JMessage.error(result.message)
}

// 指令明细查询
const mtlNo1 = ref('')

const NumberList1 = ref<number>()

const TableDateListQuery = ref({
  lot: [],
  duty: []
})

const InstructionDetailMethods = async () => {
  isLoading5.value = true
  const result = await InstructionDetail(slipNo1.value, mtlNo1.value)

  if (result.data !== null) {
    TableDateListQuery.value.lot = result.data.lot
    TableDateListQuery.value.duty = result.data.duty
    NumberList1.value = result.data.duty.reduce((item: any, index: any, list: number) => {
      return (list += Number(index.dutyQty))
    }, 0)
    summaryData.value[0].num = NumberList.value! - NumberList1.value!
    formList6.value[2].inputValue = NumberList.value as any
  }
  isLoading5.value = false
}

const clicktogetdata6 = (row: any) => {
  const { mtlNo } = row

  mtlNo1.value = mtlNo
  ResponsibilityProfileAddedMethodsParms.value.mtlNo = mtlNo
  TheAttributionDetailsAreDeletedMethodsParms.value.mtlNo = mtlNo
  NumberList.value = row.actQty1
  qtyList2.value = Number(row.actQty1)
  qtyList.value = Number(row.actQty1)
  InstructionDetailMethods()
}

// 客人号和大底号查询
const lotNo1 = ref('')

const style1 = ref('')

const GuestNumberDrinkBigBottomNumberInquiryMethods = async () => {
  const result = await GuestNumberDrinkBigBottomNumberInquiry(slipNo1.value, lotNo1.value, style1.value)
  formList2.value = result.map((item: any) => {
    return {
      type: 'input',
      inputPlaceholder: '',
      inputDisabled: true,
      inputValue: item.sizeNo,
      inputLabel: '',
      inputWidth: '100px !important'
    }
  })

  GuestNumber.value = result.map((item: any) => {
    return item.sizeNo
  })

  formList3.value = result.map((item: any) => {
    return {
      type: 'input',
      inputPlaceholder: '',
      inputDisabled: true,
      inputValue: item.soleSize,
      inputLabel: '',
      inputWidth: '100px !important'
    }
  })

  OutbackgroundNumber.value = result.map((item: any) => {
    return item.soleSize
  })
  sizeNum.value = result?.length || 0
}

// 部门全部查询
const InsertionComplementSystem = ref()

const DepartmentAllInquiryMethods = async () => {
  let NewArray = []
  const result = await DepartmentAllInquiry()
  NewArray = result.reduce((arr: any, item: any) => {
    if (item.deptNo && item.deptName) {
      // 只添加非空的 typeName 和 typeNo
      arr.push(item.deptNo + ' ' + item.deptName)
    }
    return arr
  }, [])
  formList5.value[1].selectOptions = EvaluatesTheArrayReturnValue(NewArray)
  formList6.value[0].selectOptions = EvaluatesTheArrayReturnValue(NewArray)
}

// 转审核
const TransferReviewMethods = async () => {
  if (prnFlag1.value === true) {
    const result = await TransferReview(slipNo1.value)
    if (result.code === 200) {
      FeedListData()
      JMessage.success(result.message)
    } else {
      FeedListData()
      JMessage.error(result.message)
    }
  } else {
    JMessage.warning('未打印不可转审核')
  }
}

// 修改
const seqNo1 = ref()

const clicktogetdata5 = (row: any) => {
  const { seqNo, lotNo, partName, segment, style, mtlNo } = row
  seqNo1.value = seqNo

  ComplementaryReplicationAddParms.value.lotNo = lotNo
  ComplementaryReplicationAddParms.value.partName = partName
  ComplementaryReplicationAddParms.value.segment = segment
  lotNo1.value = lotNo
  style1.value = style
  TheAttributionDetailsAreDeletedMethodsParms.value.mtlNo = mtlNo
  slipNoList3.value = row
  GuestNumberDrinkBigBottomNumberInquiryMethods()
}

const listANy = ref<any>([])

const confirmChange5 = (row: any) => {
  listANy.value.push(row)
}

const confirmChange3 = async (row?: any) => {
  const result = await LoginWork.put<any, any>(
    `/pcFactorStockQuery/spDetailUpdate?sizeNum=${sizeNum.value}`,
    row.map((item: any) => {
      item.slipNo = slipNo1
      // item.seqNo = seqNo1.value
      return item
    })
  )
  if (result.code === 200) {
    MakeUpDetailedProgressList()
    JMessage.success(result.message)
  } else {
    JMessage.error(result.message)
  }
}

const remarkList = ref('')

// 备注说明
const DescrExplain = ref('')

const RemarksModification = async () => {
  const result = await Descr(slipNo1.value, DescrExplain.value)
  if (result.code === 200) {
    FeedListData()
    JMessage.success(result.message)
  } else {
    JMessage.error(result.message)
  }
}

// 整单删除
const DeleteCompleteOrderQuery = ref<string>('')

const DeleteCompleteOrder = async () => {
  const result = await CompleteOrder(DeleteCompleteOrderQuery.value!)
  if (result.code === 200) {
    FeedListData()
    JMessage.success(result.message)
  } else {
    JMessage.error(result.message)
  }
}

const handleCloseMateriaLKlc = (_done?: () => void) => {
  ElMessageBox.confirm('确定要删除该数据吗')
    .then(async () => {
      DeleteCompleteOrder()
    })
    .catch(() => {})
}

// 打印补料单
const printInOneQuery = ref()

const printInOneTableDate = ref<any>([])

const printInOne = async () => {
  await RemarksModification1()
  const result = await printInBills(printInOneQuery.value)
  if (result.code === 200) {
    printInOneTableDate.value = result.data
    FeedListData()
    setTimeout(() => {
      printQRCode()
    }, 5)

    console.log(printInOneTableDate.value)
    JMessage.success(result.message)
  } else {
    JMessage.error(result.message)
  }
}

const printQRCode = () => {
  const qrCodeContainer = document.querySelector<any>('.qrCodeContainer')
  if (qrCodeContainer) {
    // 临时显示 .qrCodeContainer 以获取其内容
    qrCodeContainer.style.display = 'block'

    const printWindow = window.open('', '_blank')
    printWindow!.document.write(`
      <!DOCTYPE html>
      <html>
        <head>
          <title>打印指令领料作业</title>
          <link rel="stylesheet" type="text/css" href="print.css" media="print">
          <style>
            body, html {
              margin: 0;
              padding: 0;
            }
            @page {
              size: auto; 
              margin: 3mm;
            }
                       @media print {  
                  .guest-info {  
                    page-break-inside: avoid; /* 避免在此行内分页 */  
                  }  
                  table {  
                    width: 100%; /* 确保表格在打印时宽度为100% */  
                    page-break-inside: auto; /* 允许表格自动分页 */  
                  }  
                  /* 添加适当的打印边距 */  
                  body {  
                    margin: 0; /* 移除页面边距 */  
                  }  
                }
            h2 {
                    margin-left: initial; /* 或者设置适合打印的左边距 */
                    page-break-inside: avoid; /* 避免在h2元素内部分页 */
                }
            h3{
              font-size:13px;
            }
               

            table, th, td {
                    border: 1px solid black; 
                    border-collapse: collapse; 
                    text-align: center;
                  }
                  th, td {
                    padding: 5px; /* 设置内边距 */
                    text-align: left; /* 设置文本对齐方式 */
                    text-align: center;
                    font-size:11px
                  }
                  .double-line {
                    border-top: 2px dashed red; 
                    border-bottom: 2px dashed red; 
                    text-align: center;
                  }
           
            /* 可以在这里添加更多自定义的打印样式 */
          </style>
        </head>
        <body>
    `)

    // 将 .qrCodeContainer 的内容复制到打印窗口的 body 中
    const cloneContainer = qrCodeContainer.cloneNode(true)
    printWindow!.document.body.appendChild(cloneContainer)

    printWindow!.document.write(`
        </body>
      </html>
    `)
    printWindow!.document.close()

    // 开始打印
    printWindow!.print()

    // 打印完成后，可以恢复 .qrCodeContainer 的原始显示状态
    qrCodeContainer.style.display = 'none'
  }
}

const printQRCode1 = () => {
  const qrCodeContainer = document.querySelector<any>('.qrCodeContainer1')
  if (qrCodeContainer) {
    // 临时显示 .qrCodeContainer 以获取其内容
    qrCodeContainer.style.display = 'block'

    const printWindow = window.open('', '_blank')
    printWindow!.document.write(`
      <!DOCTYPE html>
      <html>
        <head>
          <title>打印指令领料作业</title>
          <link rel="stylesheet" type="text/css" href="print.css" media="print">
          <style>
            body, html {
              margin: 0;
              padding: 0;
            }
            @page {
              size: auto; 
              margin: 3mm;
            }
           @media print {  
  .guest-info {  
    page-break-inside: avoid; /* 避免在此行内分页 */  
  }  
  table {  
    width: 100%; /* 确保表格在打印时宽度为100% */  
    page-break-inside: auto; /* 允许表格自动分页 */  
  }  
  /* 添加适当的打印边距 */  
  body {  
    margin: 0; /* 移除页面边距 */  
  }  
}
            h2 {
                    margin-left: initial; /* 或者设置适合打印的左边距 */
                    page-break-inside: avoid; /* 避免在h2元素内部分页 */
                }
            h3{
              font-size:13px;
            }
               

            table, th, td {
                    border: 1px solid black; 
                    border-collapse: collapse; 
                    text-align: center;
                  }
                  th, td {
                    padding: 5px; /* 设置内边距 */
                    text-align: left; /* 设置文本对齐方式 */
                    text-align: center;
                    font-size:11px
                  }
                  .double-line {
                    border-top: 2px dashed red; 
                    border-bottom: 2px dashed red; 
                    text-align: center;
                  }
           
            /* 可以在这里添加更多自定义的打印样式 */
          </style>
        </head>
        <body>
    `)

    // 将 .qrCodeContainer 的内容复制到打印窗口的 body 中
    const cloneContainer = qrCodeContainer.cloneNode(true)
    printWindow!.document.body.appendChild(cloneContainer)

    printWindow!.document.write(`
        </body>
      </html>
    `)
    printWindow!.document.close()

    // 开始打印
    printWindow!.print()

    // 打印完成后，可以恢复 .qrCodeContainer 的原始显示状态
    qrCodeContainer.style.display = 'none'
  }
}

// 平均分摊
const TableDateList = ref<number>()

const shareAlikeMethod = async () => {
  isLoading12.value = true
  const result = await shareAlike(typePersron.value!)

  // ResponsibilityDocumentationListTableDateList.value?.map((item: any, index: number) => {
  //   return (item.qty = result[index])
  // })
  // qty2.value = result[0]
  ResponsibilityDocumentationList()
  isLoading12.value = false
}

// 修改后点击确定按钮
const confirmChange = async (row: any) => {
  const result = await LoginWork.put<any, any>(
    `/pcFactorStockQuery/getDutyFileUpdate?type=${numberResponsibility.value!}`,
    [row].map((item) => {
      row.qty = Number(item.qty)
      return item
    })
  )
  if (result.code === 200) {
    JMessage.success(result.message)
  } else {
    JMessage.error(result.message)
  }
}

// 责任员工插入新增
const selectList5 = (row: any) => {
  ArrayTableDateList.value = row.map((item: any) => {
    item.deptName = item.vendorName
    item.deptNo = item.vendorNo
    return item
  })
}

const Interposition = () => {
  if (ArrayTableDateList.value.length !== 0) {
    ResponsibleEmployeeInsertionSystemCanOnly()
  } else {
    JMessage.warning('插入的数据不可为空')
  }
}

const selectList1 = (row: any) => {
  ArrayTableDateList.value = row.map((item: any) => {
    return item
  })
}

const ArrayTableDateList = ref<any>([])

const ResponsibleEmployeeInsertionSystemCanOnly = async () => {
  const result = await ResponsibilityProfileNewInsert(numberResponsibility.value!, ArrayTableDateList.value)
  if (result.code === 200) {
    ResponsibilityDocumentationList()
    JMessage.success(result.message)
  } else {
    JMessage.error(result.message)
  }
}

// 责任员工
const numberResponsibility = ref<number>()

const ResponsibilityDocumentationListTableDateList = ref<ResponsibilityDocumentationInterface[]>()

const qty2 = ref()

const ResponsibilityDocumentationList = async () => {
  const result = await ResponsibilityDocumentation(numberResponsibility.value!)
  if (result) {
    ResponsibilityDocumentationListTableDateList.value = result.map((item: any) => {
      item.change = 'Y'
      item.disableConfirm = true
      if (item.qty !== null) {
        item.qty = Number(item.qty)
      }
      return item
    })
  }
}

// 员工信息
const InformationOfEmployeesIuqeryParms = ref<InformationOfEmployeesParms>({
  pageNum: 1,
  pageSize: 40
})

const InformationOfEmployeesIuqeryParmsTableDateList = ref<InformationOfEmployeesInterface>({
  dtos: []
})

const deptName1 = ref('')
const name1 = ref('')

const InformationOfEmployeesIuqery = async () => {
  isLoading11.value = true
  const result = await InformationOfEmployees(InformationOfEmployeesIuqeryParms.value, deptName1.value, name1.value)
  InformationOfEmployeesIuqeryParmsTableDateList.value.dtos = result.dtos
  total.value = result.total!
  isLoading11.value = false
}

// 厂商数据
const vendor = ref<VendorDatadParmsInterface>({
  dtos: []
})

const EvaluatesTheArrayReturnValue = (ArrayList: any) => {
  return ArrayList.map((item: any, index: any) => {
    return {
      optionKey: index,
      optionValue: item,
      optionLabel: item
    }
  })
}

const VendorQueryDateListParms = ref<VendorDatadParms>({
  pageNum: 1,
  pageSize: 40
})

const vendorNo = ref<string>('')

const vendorName = ref<string>('')

const VendorDataListMethods = async () => {
  isLoading10.value = true
  const result = await VendorDataList(VendorQueryDateListParms.value, vendorNo.value, vendorName.value)
  totalT.value = result.total!
  vendor.value.dtos = result.dtos
  isLoading10.value = false
}

const VendorQueryDateListParms1 = ref<VendorDatadParms>({
  pageNum: -1,
  pageSize: -1
})

const VendorQueryDateList = async () => {
  let NewArray = []
  const result = await VendorData(VendorQueryDateListParms1.value)
  NewArray = result.list.reduce((arr: any, item: any) => {
    if (item.vendorNo && item.vendorName) {
      // 只添加非空的 typeName 和 typeNo
      arr.push(item.vendorNo + ' ' + item.vendorName)
    }
    return arr
  }, [])
  formList5.value[0].selectOptions = EvaluatesTheArrayReturnValue(NewArray)
  formList.value[14].selectOptions = EvaluatesTheArrayReturnValue(NewArray)
}

// 补量复制
const ComplementaryReplicationAddParms = ref<ComplementaryReplicationParms>({
  lotNo: '',
  partName: '',
  segment: -1,
  slipNo: ''
})

const ComplementaryReplicationAdd = async () => {
  await confirmChange3(SupplementaryDetailDataStorage.value.detail)
  const result = await ComplementaryReplication(ComplementaryReplicationAddParms.value)
  if (result.code === 200) {
    MakeUpDetailedProgressList()
    JMessage.success(result.message)
  } else {
    JMessage.error(result.message)
  }
}

// 计算补料明细
const sizeNum = ref()

const CalculateFeedDetailsAdd = async () => {
  await confirmChange3(SupplementaryDetailDataStorage.value.detail)
  const result = await CalculateFeedDetails(slipNo1.value!, sizeNum.value)
  if (result.code === 200) {
    MakeUpDetailedProgressList()
    JMessage.success(result.message)
  } else {
    JMessage.error(result.message)
  }
}

// 补料部位追加查询
const lotNo = ref()

const slipNo1 = ref()

const PartFeedSupplementaryQuery = async () => {}

// 新增追加补料部位
const AddedAnAdditionalParms = ref<AddedAnAdditionalComplementParms>({
  blFlag: '普通开补',
  lotNo: '',
  seqNo: [],
  size: [],
  slipDeptName: '',
  slipDeptNo: '',
  slipNo: ''
})

const selectList2 = (row: any) => {
  AddedAnAdditionalParms.value.seqNo = row.map((item: any) => {
    return item.seqNo
  })
}

const selectList3 = (row: any) => {
  AddedAnAdditionalParms.value.size = row.map((item: any) => {
    return item.size
  })
}

const AddedAnAdditional = async () => {
  AddedAnAdditionalParms.value.size = AddedAnAdditionalParms.value.size.filter((item) => item)
  const result = await AddedAnAdditionalComplement(AddedAnAdditionalParms.value)
  if (result.code === 200) {
    FeedListData()
    JMessage.success(result.message)
  } else {
    JMessage.error(result.message)
  }
}

// 开补子材料查询
const clicktogetdata1 = (row: any) => {
  const { mtlNo, partName, segment } = row
  SubmaterialQueryParms.value.mtlNo = mtlNo
  SubmaterialQueryParms.value.partName = partName
  SubmaterialQueryParms.value.segment = segment

  SubmaterialQuery()
}

const SubmaterialQueryParms = ref<OpenTheFillerMaterialParms>({
  lotNo: '',
  mtlNo: '',
  partName: '',
  segment: 0,
  sysUser: ''
})

const SubmaterialQueryTableDateList = ref()

const SubmaterialQuery = async () => {
  const result = await OpenTheFillerMaterial(SubmaterialQueryParms.value)
  SubmaterialQueryTableDateList.value = result
}

// 查询
const inquireTableDateListQuery = ref()

const inquireTableDateListTopGoBootom = ref<FeedPartQueryInterface>({
  size: [],
  slipDept: [],
  dtos: [],
  slipType: []
})

const inquireTableDateList = async () => {
  const result = await FeedPartQuery(inquireTableDateListQuery.value)

  const result1 = await FeedPartQuery1()
  inquireTableDateListTopGoBootom.value.size = result.size
  inquireTableDateListTopGoBootom.value.slipDept = result.slipDept
  inquireTableDateListTopGoBootom.value.dtos = result.dtos
  inquireTableDateListTopGoBootom.value.slipType = result.slipType

  SubmaterialQueryParms.value.mtlNo = result.dtos[0]?.mtlNo || ''
  SubmaterialQueryParms.value.partName = result.dtos[0]?.partName || ''
  SubmaterialQueryParms.value.segment = result.dtos[0]?.segment || 1

  let NewArray = result1.reduce((arr: any, item: any) => {
    if (item.deptName) {
      // 只添加非空的 typeName 和 typeNo
      arr.push(item.deptNo + ' ' + item.deptName)
    }
    return arr
  }, [])

  formList1.value[0].selectOptions = EvaluatesTheArrayReturnValue(NewArray)

  SubmaterialQuery()
}

// 补制明细
const NumberList = ref<number>()

const SupplementaryDetailDataStorage = ref<any>({
  numberDetail: [],
  mtl: [],
  detail: []
})

const countList = ref()

const countList1 = ref<any>()

const lqtyListArray = ref<any>([])

const MakeUpDetailedProgressListParms = ref()

const MakeUpDetailedProgressList = async () => {
  isLoading2.value = true
  const result = await MakeUpDetailedProgress(MakeUpDetailedProgressListParms.value)

  if (result !== null) {
    SupplementaryDetailDataStorage.value.detail = result.detail.map((item: any) => {
      item.change = 'Y'
      item.disableConfirm = true
      return item
    })
    seqNo1.value = SupplementaryDetailDataStorage.value.detail[0].seqNo || ''
    lotNo1.value = ComplementaryReplicationAddParms.value.lotNo = SupplementaryDetailDataStorage.value.detail[0].lotNo || ''
    mtlNo1.value = SupplementaryDetailDataStorage.value.detail[0].mtlNo || ''
    ComplementaryReplicationAddParms.value.partName = SupplementaryDetailDataStorage.value.detail[0].partName || ''
    ComplementaryReplicationAddParms.value.segment = SupplementaryDetailDataStorage.value.detail[0].segment
    style1.value = SupplementaryDetailDataStorage.value.detail[0].style as string
    TheAttributionDetailsAreDeletedMethodsParms.value.mtlNo = SupplementaryDetailDataStorage.value.detail[0].mtlNo || ''
    slipNoList3.value = SupplementaryDetailDataStorage.value.detail[0]
    // qtyList.value = Number(SupplementaryDetailDataStorage.value.mtl[0].actQty1)
    lqtyListArray.value = result.detail.map((item: any) => {
      const newItem = <any>{}
      for (const key in item) {
        if (
          !(
            key === 'color' ||
            key === 'change' ||
            key === 'cutNum' ||
            key === 'lotNo' ||
            key === 'mtlNo' ||
            key === 'musage' ||
            key === 'ordQty' ||
            key === 'partName' ||
            key === 'percent' ||
            key === 'segment' ||
            key === 'seqNo' ||
            key === 'size1' ||
            key === 'size2' ||
            key === 'style' ||
            key === 'totalQty'
          )
        ) {
          // 如果键不是我们要过滤掉的属性之一，则将其添加到新对象中
          newItem[key] = item[key]
        }
      }
      // 返回新的对象，它不包含被过滤掉的属性

      return newItem
    })
    countList.value = SupplementaryDetailDataStorage.value.detail[0].totalQty

    countList1.value = SupplementaryDetailDataStorage.value.detail[0].total

    GuestNumberDrinkBigBottomNumberInquiryMethods()
  } else {
    SupplementaryDetailDataStorage.value.detail = []
  }

  if (result !== null) {
    SupplementaryDetailDataStorage.value.mtl = result.mtl.map((item: any) => {
      if (item.flag === 'Y') {
        item.backgroundColor = '#3FFF38'
      }
      if (item.actQty1 !== null) {
        item.actQty1 = item.actQty1
      }
      if (item.reqQty !== null) {
        item.reqQty = Number(item.reqQty)
      }
      if (item.actQty !== null) {
        item.actQty = Number(item.actQty)
      }

      return item
    })
    if (SupplementaryDetailDataStorage.value.mtl.length !== 0) {
      NumberList.value = SupplementaryDetailDataStorage.value.mtl[0].actQty1
    }
  } else {
    SupplementaryDetailDataStorage.value.mtl = []
  }
  if (result !== null) {
    if (SupplementaryDetailDataStorage.value.mtl.length !== 0) {
      ResponsibilityProfileAddedMethodsParms.value.mtlNo = SupplementaryDetailDataStorage.value.mtl[0].mtlNo || ''
    }
  }
  InstructionDetailMethods()
  isLoading2.value = false
}

// 补料单资料数据
const prnFlag1 = ref()

const clicktogetdata = (row: any) => {
  const { slipNo, dutyMemo, blFlag, mtlNo, prnFlag } = row
  MakeUpDetailedProgressListParms.value = slipNo
  AddedAnAdditionalParms.value.slipNo = slipNo
  slipNo1.value = slipNo
  printInOneQuery.value = slipNo
  DeleteCompleteOrderQuery.value = slipNo
  DescrExplain.value = dutyMemo
  remarkList.value = dutyMemo
  ComplementaryReplicationAddParms.value.slipNo = slipNo
  value1.value = blFlag
  ResponsibilityProfileAddedMethodsParms.value.slipNo = slipNo
  TheAttributionDetailsAreDeletedMethodsParms.value.slipNo = slipNo
  prnFlag1.value = prnFlag
  tableDateListS.value = row
  MakeUpDetailedProgressList()
  GuestNumberDrinkBigBottomNumberInquiryMethods()
  InstructionDetailMethods()
}

const FeedListDataParms = ref<ReplenishmentBillParms>({
  endslipDate: '',
  lotNo: '',
  pageNum: 1,
  pageSize: 40,
  slipNo: '',
  startslipDate: ''
})

const FeedListDataTableDateList = ref<ReplenishmentBillInterfacE>({
  dtos: []
})

const FeedListData = async () => {
  isLoading1.value = true
  const result = await ReplenishmentBill(FeedListDataParms.value)
  FeedListDataTableDateList.value.dtos = result.dtos.map((item: any) => {
    if (item.prnFlag === 'Y') {
      item.prnFlag = true
    }
    if (item.cfmFlag === 'Y') {
      item.cfmFlag = true
    }
    if (item.financeFlag === 1) {
      item.financeFlag = true
    }
    return item
  })

  totalTk.value = result.total!
  if (result.dtos.length > 0) {
    MakeUpDetailedProgressListParms.value = result.dtos[0]?.slipNo || ''
    AddedAnAdditionalParms.value.slipNo = result.dtos[0]?.slipNo || ''
    slipNo1.value = result.dtos[0]?.slipNo || ''
    DescrExplain.value = result.dtos[0]?.dutyMemo || ''
    remarkList.value = result.dtos[0]?.dutyMemo || ''
    ComplementaryReplicationAddParms.value.slipNo = result.dtos[0]?.slipNo || ''
    value1.value = FeedListDataTableDateList.value.dtos[0].blFlag
    ResponsibilityProfileAddedMethodsParms.value.slipNo = result.dtos[0].slipNo || ''
    TheAttributionDetailsAreDeletedMethodsParms.value.slipNo = result.dtos[0].slipNo || ''
    prnFlag1.value = result.dtos[0].prnFlag || ''
    tableDateListS.value = result.dtos[0]
  }

  MakeUpDetailedProgressList()
  isLoading1.value = false
}

const totalTk = ref(0)

const handleSizeChangeTk = (val: number) => {
  FeedListDataParms.value.pageSize = val
  FeedListData()
}

const handleCurrentChangeTk = (val: number) => {
  FeedListDataParms.value.pageNum = val
  FeedListData()
}

// 统一调用接口
const interAceFunct = () => {
  FeedListData()

  VendorQueryDateList()

  DepartmentAllInquiryMethods()
}

// 用户信息
const userInfo = ref()

onMounted(() => {
  interAceFunct()

  let userInf = sessionStorage.getItem('userInfo')

  userInfo.value = JSON.parse(userInf!)
})

const tableHeader = ref([
  {
    label: '补料单号',
    prop: 'slipNo',
    width: 70
  },
  {
    label: '补料日期',
    prop: 'slipDate',
    width: 70
  },
  {
    label: '补料部门',
    prop: 'dutyDeptName',
    width: 70
  },
  {
    label: '打印',
    type: 'checkbox',
    prop: 'prnFlag',
    width: '69px'
  },
  {
    label: '转审核',
    type: 'checkbox',
    prop: 'cfmFlag',
    width: '69px'
  },
  {
    label: '审核',
    type: 'checkbox',
    prop: 'financeFlag',
    width: '69px'
  }
])

const tableHeader2 = ref([
  {
    label: '指令',
    prop: 'lotNo',
    change: true
  },
  {
    label: '型体',
    prop: 'style',
    change: true
  },
  {
    label: '指令数',
    prop: 'ordQty',
    change: true
  },
  {
    label: '颜色',
    prop: 'color',
    change: true
  },
  {
    label: '片数',
    prop: 'cutNum',
    change: true
  },
  {
    label: '部位',
    prop: 'partName',
    change: true
  },
  {
    label: '段',
    prop: 'segment',
    change: true
  }
])

const tableHeader3 = ref([
  {
    label: '物料编码',
    prop: 'mtlNo',
    width: '55',
    backgroundColor: 'red'
  },
  {
    label: '材料颜色',
    prop: 'mtlColor',
    width: '55'
  },
  {
    label: '材料名称',
    prop: 'mtlName'
  },
  {
    label: '规格',
    prop: 'mtlSpec',
    width: '55'
  },
  {
    label: '单位',
    prop: 'mtlUnit',
    width: '40'
  },
  {
    label: '需求用量',
    prop: 'reqQty',
    width: '50'
  },
  {
    label: '原仓应发量',
    prop: 'actQty'
  },
  {
    label: '在用库存',
    prop: 'subQty'
  },
  {
    label: '责任用量',
    prop: 'actQty1'
  }
])

const tableHeader4 = ref([
  {
    label: '左',
    prop: 'lqty1',
    width: '55'
  },
  {
    label: '右',
    prop: 'rqty1',
    width: '55'
  },
  {
    label: '左',
    prop: 'lqty2',
    width: '55'
  },
  {
    label: '右',
    prop: 'rqty2',
    width: '55'
  },
  {
    label: '左',
    prop: 'lqty3',
    width: '55'
  },
  {
    label: '右',
    prop: 'rqty3',
    width: '55'
  },
  {
    label: '左',
    prop: 'lqty4',
    width: '55'
  },
  {
    label: '右',
    prop: 'rqty4',
    width: '55'
  },
  {
    label: '左',
    prop: 'lqty5',
    width: '55'
  },
  {
    label: '右',
    prop: 'rqty5',
    width: '55'
  },
  {
    label: '左',
    prop: 'lqty6',
    width: '55'
  },
  {
    label: '右',
    prop: 'rqty6',
    width: '55'
  },
  {
    label: '左',
    prop: 'lqty7',
    width: '55'
  },
  {
    label: '右',
    prop: 'rqty7',
    width: '55'
  },
  {
    label: '左',
    prop: 'lqty8',
    width: '55'
  },
  {
    label: '右',
    prop: 'rqty8',
    width: '55'
  },
  {
    label: '左',
    prop: 'lqty9',
    width: '55'
  },
  {
    label: '右',
    prop: 'rqty9',
    width: '55'
  },
  {
    label: '左',
    prop: 'lqty10',
    width: '55'
  },
  {
    label: '右',
    prop: 'rqty10',
    width: '55'
  },
  {
    label: '左',
    prop: 'lqty11',
    width: '55'
  },
  {
    label: '右',
    prop: 'rqty11',
    width: '55'
  },
  {
    label: '左',
    prop: 'lqty12',
    width: '55'
  },
  {
    label: '右',
    prop: 'rqty12',
    width: '55'
  },
  {
    label: '左',
    prop: 'lqty13',
    width: '55'
  },
  {
    label: '右',
    prop: 'rqty13',
    width: '55'
  },
  {
    label: '左',
    prop: 'lqty14',
    width: '55'
  },
  {
    label: '右',
    prop: 'rqty14',
    width: '55'
  },
  {
    label: '左',
    prop: 'lqty15',
    width: '55'
  },
  {
    label: '右',
    prop: 'rqty15',
    width: '55'
  },
  {
    label: '左',
    prop: 'lqty16',
    width: '55'
  },
  {
    label: '右',
    prop: 'rqty16',
    width: '55'
  },
  {
    label: '左',
    prop: 'lqty17',
    width: '55'
  },
  {
    label: '右',
    prop: 'rqty17',
    width: '55'
  },
  {
    label: '左',
    prop: 'lqty18',
    width: '55'
  },
  {
    label: '右',
    prop: 'rqty18',
    width: '55'
  },
  {
    label: '左',
    prop: 'lqty19',
    width: '55'
  },
  {
    label: '右',
    prop: 'rqty19',
    width: '55'
  },
  {
    label: '左',
    prop: 'lqty20',
    width: '55'
  },
  {
    label: '右',
    prop: 'rqty20',
    width: '55'
  },
  {
    label: '合计（双）',
    prop: 'totalQty',
    change: true
  },
  {
    label: '补制比例',
    prop: 'percent',
    change: true
  },
  {
    label: '物料编号',
    prop: 'mtlNo',
    change: true
  },
  {
    label: '尺码起',
    prop: 'size1',
    change: true
  },
  {
    label: '尺码止',
    prop: 'size2',
    change: true
  }
])

const tableHeader5 = ref([
  {
    label: '责任厂商',
    prop: 'dutyName',
    width: '60'
  },
  {
    label: '责任员工',
    prop: 'dutyName2',
    width: '60'
  },
  {
    label: '数量',
    prop: 'dutyQty',
    width: '60'
  }
])

const tableHeader6 = ref([
  {
    label: '指令',
    prop: 'lotNo'
  },
  {
    label: '数量',
    prop: 'qty'
  }
])

const tableHeader1 = ref([
  {
    label: '序号',
    prop: 'seqNo'
  },
  {
    label: '部位',
    prop: 'partName'
  },
  {
    label: '段',
    prop: 'segment'
  },
  {
    label: '材料',
    prop: 'mtlName'
  },
  {
    label: '规格/单位',
    prop: 'mtlUnit'
  },
  {
    label: '材料颜色',
    prop: 'mtlColor'
  },
  {
    label: '尺码起',
    prop: 'size1'
  },
  {
    label: '尺码止',
    prop: 'size2'
  }
])

const tableHeader7 = ref([
  {
    label: '号码',
    prop: 'size',
    width: '55'
  }
])

const tableHeader8 = ref([
  {
    label: '分类名称',
    prop: 'dutyName'
  },
  {
    label: '物料编码',
    prop: 'dutyName'
  },
  {
    label: '材料颜色',
    prop: 'dutyName'
  },
  {
    label: '材料名称',
    prop: 'dutyName'
  },
  {
    label: '规格',
    prop: 'dutyName'
  },
  {
    label: '单位',
    prop: 'dutyName'
  }
])

const tableHeader9 = ref([
  {
    label: '代码',
    prop: 'vendorNo'
  },
  {
    label: '厂商',
    prop: 'vendorName'
  }
])

const tableHeader10 = ref([
  {
    label: '部门名称',
    prop: 'deptName'
  },
  {
    label: '姓名',
    prop: 'name'
  },
  {
    label: '职务',
    prop: 'position'
  },
  {
    label: '工种',
    prop: 'workType'
  }
])

const tableHeader11 = ref([
  {
    label: '厂商&部门',
    prop: 'deptName',
    change: true
  },
  {
    label: '姓名',
    prop: 'name',
    change: true
  },
  {
    label: '占比(%)',
    prop: 'qty'
  }
])

// 表格3数据

const value1 = ref<any>('')

const options = [
  {
    value: '普通开补',
    label: '普通开补'
  },
  {
    value: '鞋面全套',
    label: '鞋面全套'
  },
  {
    value: '成型全套',
    label: '成型全套'
  },
  {
    value: '原材料开补',
    label: '原材料开补'
  }
]

const Launchform = (row: any) => {
  ResponsibilityProfileAddedMethodsParms.value.vendorNo = row[14].selectValue.split(' ')[0]
  ResponsibilityProfileAddedMethodsParms.value.vendorName = row[14].selectValue.split(' ')[1]
  if (row[0].inputValue !== '' || row[1].inputValue !== '' || row[2].dateValue !== '') {
    FeedListDataParms.value.slipNo = row[0].inputValue
    FeedListDataParms.value.lotNo = row[1].inputValue
    FeedListDataParms.value.startslipDate = row[2].dateValue[0]
    FeedListDataParms.value.endslipDate = row[2].dateValue[1]
    FeedListData()
  }

  inquireTableDateListQuery.value = row[3].inputValue
  SubmaterialQueryParms.value.lotNo = row[3].inputValue
  AddedAnAdditionalParms.value.lotNo = row[3].inputValue
  lotNo.value = row[3].inputValue

  if (row[15].inputValue !== '' && row[14].selectValue !== '') {
    let obj: any[] = []
    obj.push({
      deptNo: row[14].selectValue.split(' ')[0],
      deptName: row[14].selectValue.split(' ')[1],
      dutyQty: Number(row[15].inputValue)
    })

    ResponsibilityProfileAddedMethodsParms.value.dutyDetail.push(obj[length])
    qtyList.value = Number(row[15].inputValue)
    qtyList2.value = Number(row[15].inputValue)
  }
}

const findClicked = async (content: string) => {
  if (content === '取消转审核') {
    TransferReviewMethods1()
  }
  // console.log(SupplementaryDetailDataStorage.value.detail)
  if (content === '保存号码') {
    if (listANy.value.length === 0) {
      return JMessage.warning('未改动任何数据')
    }
    // console.log(listANy.value)
    confirmChange3(SupplementaryDetailDataStorage.value.detail)
  }
  if (content === '插入补料部位(新增)') {
    if (inquireTableDateListQuery.value === '') {
      return JMessage.warning('指令不可为空')
    } else {
      // inquireTableDateList()
      // tableRef(rowAny.value)
      InsertionComplementSystem.value = true
      drawer1.value = true
    }
  }
  if (content === '插入补料部位(追加)') {
    if (lotNo.value === '' || (slipNo1 as unknown as string) === '') {
      JMessage.warning('补料单号或指令不可为空')
    } else {
      // inquireTableDateList()
      // tableRef(rowAny.value)
      InsertionComplementSystem.value = false
      drawer1.value = true
      // setTimeout(() => {
      //   PartFeedSupplementaryQuery()
      // }, 50)
    }
  }
  if (content === '计算补料明细') {
    CalculateFeedDetailsAdd()
    // if (SupplementaryDetailDataStorage.value.mtl.length === 0) {
    //   CalculateFeedDetailsAdd()
    // } else {
    //   JMessage.warning('不可重复计算')
    // }
  }
  if (content === '补量复制') {
    ComplementaryReplicationAdd()
  }
  if (content === '转审核') {
    TransferReviewMethods()
  }
  if (content === '责任厂商/员工(%)') {
    ResponsibilityProfileAddedMethodsParms.value.type = 0
    numberResponsibility.value = 1
    typePersron.value = 0
    VendorDataListMethods()
    InformationOfEmployeesIuqery()
    ResponsibilityDocumentationList()
    drawer2.value = true
  }
  if (content === '责任员工') {
    ResponsibilityProfileAddedMethodsParms.value.type = 1
    numberResponsibility.value = 2
    typePersron.value = 1
    VendorDataListMethods()
    ResponsibilityDocumentationList()
    InformationOfEmployeesIuqery()
    DepartmentAllInquiryMethods()
    drawer3.value = true
  }
  if (content === '打印补料单(14个号码)') {
    if(printInOneQuery.value === undefined){
      return JMessage.warning('请选择需要打印的数据')
    }
    printInOne1()
  }
  if (content === '整单删除') {
    if (DeleteCompleteOrderQuery.value === '') {
      JMessage.warning('请选择需要删除的数据')
    } else {
      handleCloseMateriaLKlc()
    }
  }
  if (content === '打印补料单') {
    if(printInOneQuery.value === undefined){
      return JMessage.warning('请选择需要打印的数据')
    }
    printInOne()
  }

  if (content === '保存备注') {
    RemarksModification()
  }
  if (content === '保存补料类型') {
    FeedTypeModifiedMethod()
  }
  if (content === '补制明细删除') {
    handleCloseMateriaLKlc1()
  }
  if (content === '责任归属明细删除') {
    handleCloseMateriaLKlc2()
  }
  if (content === '确认') {
    ResponsibilityProfileAddedMethodsParms.value.type = 2
    if (ResponsibilityProfileAddedMethodsParms.value.dutyDetail.length !== 0) {
      if (
        ResponsibilityProfileAddedMethodsParms.value.dutyDetail[0].deptName !== '' &&
        ResponsibilityProfileAddedMethodsParms.value.dutyDetail[0].dutyQty !== ''
      ) {
        ResponsibilityProfileAddedMethods()
      }
    } else {
      JMessage.warning('数量和厂商不可为空')
    }
  }
  if (content === '置空') {
    FeedListDataParms.value.endslipDate = ''
    FeedListDataParms.value.lotNo = ''
    FeedListDataParms.value.pageNum = 1
    FeedListDataParms.value.pageSize = 40
    FeedListDataParms.value.slipNo = ''
    FeedListDataParms.value.startslipDate = ''
    clearFormList()
    FeedListData()
  }
}

const printInOne1 = async () => {
  await RemarksModification1()
  const result = await printInBills(printInOneQuery.value)
  if (result.code === 200) {
    FeedListData()
    printInOneTableDate.value = result.data
    setTimeout(() => {
      printQRCode1()
    }, 5)
    console.log(result)

    JMessage.success(result.message)
  } else {
    JMessage.error(result.message)
  }
}

const RemarksModification1 = async () => {
  const result = await Descr(slipNo1.value, DescrExplain.value)
  if (result.code === 200) {
    FeedListData()
  } else {
  }
}

// 清空责任人
const typePersron = ref()

const ResponsibilityClearMethdos = async () => {
  try {
    const res = await ResponsibilityClear(typePersron.value)
    if (res.code === 200) {
      JMessage.success(res.message)
      ResponsibilityDocumentationList()
    } else {
      JMessage.error(res.message)
    }
  } catch (error) {
    JMessage.error('清空失败')
  }
}

const handleCloseMateriaLKlc5 = (_done?: () => void) => {
  ElMessageBox.confirm('确认要全部清空责任员工吗')
    .then(async () => {
      ResponsibilityClearMethdos()
    })
    .catch(() => {})
}

const findClicked3 = (content: string) => {
  if (content === '清空') {
    handleCloseMateriaLKlc5()
  }
  if (content === '平均分摊') {
    shareAlikeMethod()
  }
  if (content === '确认') {
    ResponsibilityProfileAddedMethods()
  }
  if (content === '删除责任员工') {
    if (EmployeeDeletionMethodsParms.value.deptName === '') {
      JMessage.warning('请选择需要删除的员工数据')
    } else handleCloseMateriaLKlc3()
  }
  if (content === '置空') {
    deptName1.value = ''
    name1.value = ''
    vendorNo.value = ''
    vendorName.value = ''
    VendorDataListMethods()
    InformationOfEmployeesIuqery()
    clearFormList1()
  }
  if (content === '统一分配') {
    ResponsibilityProfileAddedMethodsParms.value.flag = 1
    ResponsibilityProfileAddedMethods()
  }
}

const clearFormList1 = () => {
  formList5.value.forEach((item) => {
    if (item.type === 'input') {
      item.inputValue = ''
    }
    if (item.type === 'select') {
      item.selectValue = ''
    }
    // Add other conditions for different form item types
  })
}

const Launchform1 = (row: any) => {
  AddedAnAdditionalParms.value.slipDeptName = row[0].selectValue.split(' ')[1]
  AddedAnAdditionalParms.value.slipDeptNo = row[0].selectValue.split(' ')[0]
}

const clickNumber1 = (number: any) => {
  if (number === '0') {
    AddedAnAdditionalParms.value.blFlag = '普通开补'
  } else if (number === '1') {
    AddedAnAdditionalParms.value.blFlag = '鞋面全套'
  } else if (number === '2') {
    AddedAnAdditionalParms.value.blFlag = '成型全套'
  } else if (number === '3') {
    AddedAnAdditionalParms.value.blFlag = '原材料开补'
  }
}

const findClicked1 = (content: string) => {
  if (content === '插入补制资料') {
    if (AddedAnAdditionalParms.value.slipDeptNo === '') {
      JMessage.warning('补料部门必须选择')
    } else if (!InsertionComplementSystem.value) {
      AddedAnAdditional()
    } else {
      AddedAnAdditionalParms.value.slipNo = ''
      AddedAnAdditional()
    }
  }
}

const Launchform6 = (row: any) => {
  if (row[0].selectValue !== '') {
    vendorNo.value = row[0].selectValue.split(' ')[0]
    vendorName.value = row[0].selectValue.split(' ')[1]
    VendorDataListMethods()
  }
  if (row[1].selectValue !== '' || row[2].inputValue !== '') {
    deptName1.value = row[1].selectValue.split(' ')[1]
    name1.value = row[2].inputValue
    InformationOfEmployeesIuqery()
  }
}

const Launchform7 = (row: any) => {
  deptName1.value = row[0].selectValue.split(' ')[1]
  name1.value = row[1].inputValue
  InformationOfEmployeesIuqery()
}

// 分页器
const total = ref(0)

const handleSizeChange = (val: number) => {
  InformationOfEmployeesIuqeryParms.value.pageSize = val
  InformationOfEmployeesIuqery()
}

const handleCurrentChange = (val: number) => {
  InformationOfEmployeesIuqeryParms.value.pageNum = val
  InformationOfEmployeesIuqery()
}

const totalT = ref(0)

const handleSizeChangeT = (val: number) => {
  VendorQueryDateListParms.value.pageSize = val
  VendorDataListMethods()
}

const handleCurrentChangeT = (val: number) => {
  VendorQueryDateListParms.value.pageNum = val
  VendorDataListMethods()
}

// 置空方法
const clearFormList = () => {
  formList.value.forEach((item) => {
    if (item.type === 'input') {
      item.inputValue = ''
    }
    if (item.type === 'select') {
      item.selectValue = ''
    }
    if (item.type === 'date') {
      item.dateValue = ''
    }
    // Add other conditions for different form item types
  })
}
</script>

<style lang="less" scoped>
h1 {
  font-size: 16px;
}

.find {
  :deep(.form .el-form-item) {
    margin: 5px 2px 0 0 !important;
    margin-right: 10px !important;
  }

  :deep(.disable) {
    width: 65px !important;
  }
}

table,
th,
td {
  border: 1px solid black;
  border-collapse: collapse;
  text-align: center;
}
th,
td {
  padding: 5px; /* 设置内边距 */
  text-align: left; /* 设置文本对齐方式 */
  text-align: center;
  font-size: 11px;
  width: 80px;
}
.double-line {
  border-top: 2px dashed red;
  border-bottom: 2px dashed red;
  text-align: center;
}

.scrollbar-container {
  overflow-x: auto;
  white-space: nowrap;
  scrollbar-width: thin; /* Specify the width of the scrollbar */
  scrollbar-color: #ffc182 #ffffff; /* Specify the color of the scrollbar */
}

/* Track */
.scrollbar-container::-webkit-scrollbar {
  width: 10px; /* Set the width of the scrollbar */
}

/* Handle */
.scrollbar-container::-webkit-scrollbar-thumb {
  background: blue; /* Set the color of the scrollbar handle */
}

/* Handle on hover */
.scrollbar-container::-webkit-scrollbar-thumb:hover {
  display: none;
}

.title1 {
  margin-left: 3px;
  width: 110px !important;
  height: 40px !important;
  line-height: 40px !important; /* 让文字垂直居中 */
  text-align: center !important; /* 让文字水平居中 */
  background-color: lightblue !important;
  color: red !important;
  display: inline-block !important; /* 使元素以块级元素内联显示 */
  white-space: nowrap !important; /* 防止文字换行 */
  border: 1px solid black !important;
}
</style>
